﻿@model UserInfoModel
@using Giant.Web.Models.User;
@using Giant.Core;
@{
    Layout = "~/Views/Shared/_ColumnsTwo.cshtml";

    //title
    Html.AddTitleParts(T("PageTitle.Account").Text);
    //page class
    Html.AppendPageCssClassParts("html-account-page");
    Html.AppendPageCssClassParts("html-user-info-page");
}
@section left
{
    @Html.Action("UserNavigation", "User", new { selectedTabId = UserNavigationEnum.Info })
}

<div class="page account-page user-info-page">
    <div class="page-title">
        <h1>@T("Account.MyAccount") - @T("Account.UserInfo")</h1>
    </div>
    <div class="page-body">
        @using (Html.BeginForm())
        {
            @Html.AntiForgeryToken()
            var validationSummary = Html.ValidationSummary(true);
            if (!MvcHtmlString.IsNullOrEmpty(validationSummary))
            {
                <div class="message-error">@validationSummary</div> 
            }
            <div class="fieldset">
                <div class="title">
                    <strong>@T("Account.YourPersonalDetails")</strong>
                </div>
                <div class="form-fields">
                    @if (Model.GenderEnabled)
                    {
                        <div class="inputs">
                            <label>@T("Account.Fields.Gender"):</label>
                            <div class="gender">
                                <span class="male">
                                    @Html.RadioButton("Gender", "M", (Model.Gender == "M"), new { id = "gender-male"})
                                    <label class="forcheckbox" for="gender-male">@T("Account.Fields.Gender.Male")</label>
                                </span>
                                <span class="female">
                                    @Html.RadioButton("Gender", "F", (Model.Gender == "F"), new { id = "gender-female" })
                                    <label class="forcheckbox" for="gender-female">@T("Account.Fields.Gender.Female")</label>
                                </span>
                            </div>
                        </div>
                    }
                    <div class="inputs">
                        @Html.LabelFor(model => model.FirstName, new { }, ":")
                        @Html.EditorFor(model => model.FirstName)
                        @Html.RequiredHint()
                        @Html.ValidationMessageFor(model => model.FirstName)
                    </div>
                    <div class="inputs">
                        @Html.LabelFor(model => model.LastName, new { }, ":")
                        @Html.EditorFor(model => model.LastName)
                        @Html.RequiredHint()
                        @Html.ValidationMessageFor(model => model.LastName)
                    </div>
                    @if (Model.DateOfBirthEnabled)
                    {
                        <div class="inputs date-of-birth">
                            <label>@T("Account.Fields.DateOfBirth"):</label>
                            @Html.DatePickerDropDowns(Html.FieldNameFor(x => x.DateOfBirthDay),
                                        Html.FieldNameFor(x => x.DateOfBirthMonth),
                                        Html.FieldNameFor(x => x.DateOfBirthYear),
                                        DateTime.Now.Year - 110,
                                        DateTime.Now.Year,
                                        Model.DateOfBirthDay,
                                        Model.DateOfBirthMonth,
                                        Model.DateOfBirthYear)
                            @if (Model.DateOfBirthRequired)
                            {
                                @Html.RequiredHint()
                            }
                            @Html.ValidationMessageFor(model => model.DateOfBirthDay)
                            @Html.ValidationMessageFor(model => model.DateOfBirthMonth)
                            @Html.ValidationMessageFor(model => model.DateOfBirthYear)
                        </div>
                    }
                    <div class="inputs">
                        @Html.LabelFor(model => model.Email, new { }, ":")
                        @Html.EditorFor(model => model.Email)
                        @Html.RequiredHint()
                        @Html.ValidationMessageFor(model => model.Email)
                    </div>
                    @if (Model.UsernamesEnabled)
                    {
                        if (Model.AllowUsersToChangeUsernames)
                        {
                        <div class="inputs">
                            @Html.LabelFor(model => model.Username, new { }, ":")
                            @Html.EditorFor(model => model.Username)
                            @Html.RequiredHint()
                            @Html.ValidationMessageFor(model => model.Username)
                            @if (Model.CheckUsernameAvailabilityEnabled)
                            {
                                @Html.Partial("_CheckUsernameAvailability")
                            }
                        </div>
                        }
                        else
                        {
                        <div class="inputs">
                            @Html.LabelFor(model => model.Username, new { }, ":")
                            @Model.Username
                        </div>
                        }
                    }
                </div>
            </div>
           
                    if (Model.PhoneEnabled)
                    {
            <div class="fieldset">
                <div class="title">
                    <strong>@T("Account.YourContactInformation")</strong>
                </div>
                <div class="form-fields">
                    @if (Model.PhoneEnabled)
                    {
                        <div class="inputs">
                            @Html.LabelFor(model => model.Phone, new { }, ":")
                            @Html.EditorFor(model => model.Phone)
                            @if (Model.PhoneRequired)
                            {
                                @Html.RequiredHint()
                            }
                            @Html.ValidationMessageFor(model => model.Phone)
                        </div>
                    }
                    
                </div>
            </div>
                    }
                    if (Model.NewsletterEnabled || Model.UserAttributes.Count > 0)
                    {
            <div class="fieldset">
                <div class="title">
                    <strong>@T("Account.Options")</strong>
                </div>
                <div class="form-fields">
                    @if (Model.NewsletterEnabled)
                    {
                        <div class="inputs">
                            @Html.LabelFor(model => model.Newsletter, new {}, ":")
                            @Html.EditorFor(model => model.Newsletter)
                            @Html.ValidationMessageFor(model => model.Newsletter)
                        </div>
                    }
                    @if (Model.UserAttributes.Count > 0)
                    {
                        @Html.Partial("_UserAttributes", Model.UserAttributes)
                    }
                </div>
            </div>
                    }
                    if (Model.AllowUsersToSetTimeZone )
                    { 
            <div class="fieldset">
                <div class="title">
                    <strong>@T("Account.Preferences")</strong>
                </div>
                <div class="form-fields">
                    @if (Model.AllowUsersToSetTimeZone)
                    {
                        <div class="inputs">
                            @Html.LabelFor(model => model.TimeZoneId, new { }, ":")
                            @Html.DropDownList("TimeZoneId", Model.AvailableTimeZones)
                            @Html.ValidationMessageFor(model => model.TimeZoneId)
                        </div>
                    }
                   
                </div>
            </div>
                    }

            if (Model.NumberOfExternalAuthenticationProviders > 0)
            {
                <div class="fieldset">
                    <div class="title">
                        <strong>@T("Account.AssociatedExternalAuth")</strong>
                    </div>
                    @if (Model.AssociatedExternalAuthRecords.Count > 0)
                    {
                        //existing associated external records
                        <div class="table-wrapper">
                            <table class="data-table">
                                <colgroup>
                                    <col />
                                    <col />
                                    <col />
                                </colgroup>
                                <thead>
                                    <tr>
                                        <th class="auth-method-name">
                                            @T("Account.AssociatedExternalAuth.AuthMethodName")
                                        </th>
                                        <th class="email">
                                            @T("Account.AssociatedExternalAuth.Email")
                                        </th>
                                        <th class="external-id">
                                            @T("Account.AssociatedExternalAuth.ExternalIdentifier")
                                        </th>
                                        <th class="remove">
                                            @T("Account.AssociatedExternalAuth.Remove")
                                        </th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach (var item in Model.AssociatedExternalAuthRecords)
                                    {
                                        <tr>
                                            <td class="auth-method-name">
                                                @item.AuthMethodName
                                            </td>
                                            <td class="email">
                                                @item.Email
                                            </td>
                                            <td class="external-id">
                                                @CommonHelper.EnsureMaximumLength(item.ExternalIdentifier, 40, "...")
                                            </td>
                                            <td class="remove">
                                                <a href="#" onclick="return removeexternalassociation(@item.Id)">@T("Account.AssociatedExternalAuth.Remove")</a>
                                            </td>
                                        </tr>
                                    }
                                </tbody>
                            </table>
                        </div>
                    }

                    @if (Model.NumberOfExternalAuthenticationProviders > Model.AssociatedExternalAuthRecords.Count)
                    {
                        //we can add more external records
                        <div class="form-fields add-more-external-records">
                            @T("Account.AssociatedExternalAuth.AddMoreRecords") <a href="@Url.RouteUrl("Login", null, "http")">@Url.RouteUrl("Login", null, "http")</a>
                        </div>
                    }
                </div>
            }
            <div class="buttons">
                <input type="submit" value="@T("Common.Save")" name="save-info-button" class="button-1 save-user-info-button" />
            </div>
        }
    </div>
</div>
<script type="text/javascript">
    function removeexternalassociation(itemId) {
        if (confirm('@T("Common.AreYouSure")')) {
            var postData = {
                id: itemId
            };
            addAntiForgeryToken(postData);
            $.ajax({
                cache: false,
                type: 'POST',
                url: '@Url.Action("RemoveExternalAssociation", "User")',
                data: postData,
                dataType: 'json',
                success: function (data) {
                    location.href = data.redirect;
                },
                error: function (xhr, ajaxOptions, thrownError) {
                    alert('Failed to delete');
                }
            });
        } 
        return false;
    }
</script>